<template>
  <div v-if="activity">
    <h2>{{ activity.title }}</h2>
    <p>日期: {{ activity.date }}</p>
    <p>地点: {{ activity.location }}</p>
    <p>描述: {{ activity.description }}</p>
  </div>
  <div v-else>
    <p>活动不存在</p>
  </div>
</template>

<script>
import { activities } from '../data/activities'

export default {
  props: ['id'],
  computed: {
    activity() {
      return activities.find(a => a.id === parseInt(this.id))
    }
  }
}
</script>